<?php
/**********************************************************************************
 
 	Main page for displaying data.
	
	Copyright (C) 2010 Benjamin Thomas
 
    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 	Author: Benjamin Thomas
	Email: thomas.ben@gmail.com
 	Created: 7/20/10
 
	Inputs: None
	
 
 ***********************************************************************************
 */
 ?>
<html> 
<head> 
	<title>Campfire - 0.2</title> 
	<link rel="stylesheet" type="text/css" href="css/marketstyle.css" /> 
	<link rel="stylesheet" type="text/css" href="css/jquery.tablesorter.css" /> 
	<link rel="stylesheet" type="text/css" href="css/menu.css" media="screen" /> 
	<link rel="stylesheet" type="text/css" href="css/ui.notify.css" />
	<link rel="stylesheet" href="css/jquery-ui-1.8.2.custom.css" type="text/css" media="all" /> 
	<script language="javascript" type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery.tablesorter.min.js"></script>
	<script language="javascript" type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>
	<script language="javascript" type="text/javascript" src="js/jquery.cookie.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery.hoverIntent.minified.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery.metadata.js"></script> 
	<script language="javascript" type="text/javascript" src="js/mbMenu.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery/ui/jquery.ui.core.min.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery/ui/jquery.ui.widget.min.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery/ui/jquery.ui.accordion.min.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery/ui/jquery.ui.tabs.min.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery/ui/jquery.ui.autocomplete.min.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery/ui/jquery.ui.position.min"></script> 
	<script language="javascript" type="text/javascript" src="js/flot/jquery.flot.js"></script> 
    <script language="javascript" type="text/javascript" src="js/flot/jquery.flot.selection.js"></script> 
	<script language="javascript" type="text/javascript" src="js/flot/jquery.flot.fillbetween.js"></script>
	<script language="javascript" type="text/javascript" src="js/flot/jquery.flot.stack.js"></script>
	<script language="javascript" type="text/javascript" src="js/flot/jquery.flot.pie.js"></script> 
	<script language="javascript" type="text/javascript" src="js/jquery.notify.js"></script> 
	<script language="javascript" type="text/javascript" src="js/campfire.js"></script> 
</head> 
<body> 
<?php include(dirname(__FILE__) . '/../inc/dbcheck.php'); ?>


<!--
<div id="test" style="background-color: red; color: black; z-index: 100; position: absolute; left: 10px; top:20px;">Nada</div>
<div id="log" style="z-index: 10; position: absolute; top: auto; bottom: 30px; left: 10px; height: 200px; width: 300px; overflow: auto; " class="ui-widget-content"></div>
-->

<div id="container">

<div id="header"><img id="logo" src="images/logo.png" />		
	<h2 style="position: absolute; top: -30px; left: 220px;">Campfire</h2>
	<div id="headerSales" style="">
	</div>
</div>





<div id="navigation">

<?php include(dirname(__FILE__) . '/../inc/menu.html'); ?>

	</div>

<div id="menu">

<div id="accordion">
    <h3><a href="#">Server Wealth</a></h3>
    <div id="wealth">
	
	</div>
    <h3><a href="#">Top Sales Days</a></h3>
    <div id="top10salesdates">
	
	</div>
</div>

<div id="content"></div>


</div>




<!-- set the container hidden to avoid a flash of unstyled content
when the page first loads -->
<div id="ncontainer" style="top:auto; left:auto; right:10px; bottom:0; margin:0 0 10px 10px; display:none">
 
    <!-- 
    Later on, you can choose which template to use by referring to the 
    ID assigned to each template.  Alternatively, you could refer
    to each template by index, so in this example, "basic-tempate" is
    index 0 and "advanced-template" is index 1.
    -->
	<div id="default"> 
		<h1>#{title}</h1> 
		<p>#{text}</p> 
	</div> 
	<div id="withIcon"> 
		<a class="ui-notify-close ui-notify-cross" href="#">x</a> 
		<div style="float:left;margin:0 10px 0 0"><img src="#{icon}" alt="warning" /></div> 
		<h1>#{title}</h1> 
		<p>#{text}</p> 
	</div> 
</div>
<script>
    $.ajaxSetup ({  
        cache: false  
    });  

    $(document).ready(function(){
		$("#log").append ( 'document is ready<BR>');
		$("#searchitem").autocomplete({
			source: function(request, response) {
				$.ajax({
					url: "ajax/searchitems.php",
					dataType: "json",
					data: {
						q: request.term
					},
					success: function(data) {
						response($.map(data, function(item) {
							return {
								label: '<img src="images/icons/' + item.icon + '" style="height:20px; width: 20px; margin-right: 5px;" /> ' + item.name,
								value: item.name,						
								id: item.itemId
							}
						}))
					}
				})
			},
			minLength: 2,
			select: function(event, ui) {
				if (ui.item) {
					showSales(14, ui.item.id);	
				} 
			},
			open: function() {
				$(this).removeClass("ui-corner-all").addClass("ui-corner-top");
			},
			close: function() {
				$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
			}
		});
		
		$("#serverlist").html(ajax_load).load("ajax/serverlist.php"); 
		$("#navigation").css('height', $(".current").first().height());
		if (!$.cookie("contentURL")) { $.cookie("contentURL", "ajax/dashboard.php?null"); }
		reload();
	});
	
	$("#accordion").accordion({
			event: "mouseover",
			autoHeight: false
	});
	
	function showToolTip(item, x, y) {
		if (item.series.tooltip)
			title = item.series.tooltip;
		else 
			title = item.series.label
		
		if (item.series.type == 'gold') 
			val = getGold(y);
		else if (item.series.type == 'int')
			val = y.toFixed(0);
		else
			val = y.toFixed(4);
		
		var contents = title + " on " + x + "<br />" + val;
		$('<div id="tooltip">' + contents + '</div>').css( {
            position: 'absolute',
			'-moz-border-radius-topleft': '6px', '-webkit-border-top-left-radius': '6px',
            display: 'block',
            top: item.pageY - 50,
            left: item.pageX + 10,
            border: '1px solid #fdd',
            padding: '2px',
			color: 'black',
            'background-color': '#fee',
            opacity: 0.85,
        }).appendTo("body").fadeIn(200);
    }
	$('#placeholder').live('mouseout', function() {
		$("#tooltip").hide();
	});
	
	function notify( template, vars, opts ){
		return $container.notify("create", template, vars, opts);
	}
	
	$('#searchitem').live('keypress', function(e) {
		if (e.which == 13) {
			$('.ui-autocomplete').hide();
			if ($('#searchitem').val().length > 0) {
				url = "ajax/searchList.php?q=" + $('#searchitem').val();
				ajaxload("#content", url);
			} else {
				$container = $("#ncontainer").notify();
				notify("default", { title:'Invalid Search', text:'You must enter a part of the name or the id of the item you are looking for.'});
			}
		}
	});


</script>
 
</body> 
</html> 